<template>
<div class="panel">
    <div class="panel-header">
        <div class="bl"></div>
        <div class="title">收款信息</div>
    </div>
    <div class="panel-body">
        <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-position="left" label-width="100px">
            <el-form-item label="收款编号" prop="receipt_no" required>
                <el-input v-model="ruleForm.receipt_no" placeholder="请填写收款编号"></el-input>
            </el-form-item>

            <el-form-item label="收款方式" prop="income_way_id" required>
                <picker-view type="paidWay" v-model="ruleForm.income_way_id" placeholder="请选择收款方式"></picker-view>
            </el-form-item>

            <el-form-item label="收款性质" prop="income_type_id" required>
                <picker-view type="paidType" v-model="ruleForm.income_type_id" placeholder="请选择收款性质"></picker-view>
            </el-form-item>

            <el-form-item label="收款日期" prop="income_date" required>
                <el-date-picker v-model="ruleForm.income_date" type="date" value-format="yyyy-MM-dd" placeholder="请填写收款日期"></el-date-picker>
            </el-form-item>

            <el-form-item label="收款金额" prop="total" required>
                <el-input type="number" v-model="ruleForm.total" placeholder="请录入收款金额"></el-input>
            </el-form-item>

            <el-form-item label="凭证" prop="receipt" required>
                <upload-files ref="receiptRef" v-model="ruleForm.receipt"></upload-files>
            </el-form-item>

            <el-form-item label="上传收据" prop="note" required>
                <upload-files ref="noteRef" v-model="ruleForm.note"></upload-files>
            </el-form-item>
        </el-form>
    </div>
</div>
</template>

<script>
import pickerView from "@/components/picker/select.vue";
import uploadFiles from '@/components/upload/files.vue';
const ruleForm = {
    receipt_no: "",
    income_way_id: "",
    income_type_id: "",
    income_date: "",
    total: "",
    receipt: [],
    note: []
}

export default {
    components: {
        pickerView,
        uploadFiles
    },
    data() {
        return {
            banquetTypeList: [],
            banquet_type_id: [],
            receiptList: [],
            noteList: [],
            ruleForm: Object.assign({}, ruleForm),
            rules: {
                receipt_no: [{
                    required: true,
                    message: "请录入收款编号",
                }],
                income_way_id: [{
                    required: true,
                    message: "请选择收款方式",
                }],
                income_type_id: [{
                    required: true,
                    message: "请选择收款性质",
                }],
                income_date: [{
                    required: true,
                    message: "请选择收款日期",
                }],
                total: [{
                    required: true,
                    message: "请录入收款金额",
                }],
                receipt: [{
                    required: true,
                    message: "上传收款凭证",
                }],
                note: [{
                    required: true,
                    message: "请上传收据",
                }],
            },
        }
    },
    methods: {
        clearFiles() {
            this.$nextTick(() => {
                this.$refs['receiptRef'].clearFiles();
                this.$refs['noteRef'].clearFiles();
            })
        },
        async submit() {
            await this.$refs['ruleForm'].validate(valid => {
                if (valid) {
                    return valid;
                } else {
                    throw "触发错误";
                }
            })
        }
    }
}
</script>

<style>

</style>
